<div style="margin-bottom: 8px; margin-top: 104px;">
    <button *ngIf="addBtn" nz-button nzType='primary' (click)="add()"><i class="anticon anticon-plus"></i>添加</button>
    <button *ngIf="editBtn" nz-button nzType='primary' (click)="edit()"><i class="anticon anticon-edit"></i>编辑</button>
    <button *ngIf="delBtn" nz-button nzType='primary' (click)="del()"><i class="anticon anticon-delete"></i>删除</button>
</div>
<div nz-row [nzGutter]="16">
    <div nz-col [nzMd]="8">
        <nz-card>
          <nz-input-group [nzSuffix]="suffixIcon">
            <input type="text" nz-input placeholder="输入关键字进行过滤" [(ngModel)]="searchValue">
          </nz-input-group>
          <ng-template #suffixIcon>
            <i class="anticon anticon-search"></i>
          </ng-template>
          <div style="margin-top: 8px; max-height: 800px; overflow: auto">
            <div *ngIf="nodes.length === 0" style="margin: 0 auto; width: 100%; text-align: center">无数据</div>
            <nz-tree
                [nzSearchValue]="searchValue"
                (nzOnSearchNode)="mouseAction('search',$event)"
                [(ngModel)]="nodes"
                [nzShowLine]="true"
                [nzDraggable]="false"
                [nzDefaultExpandAll]="true"
                (nzExpandChange)="mouseAction('expand',$event)"
                (nzClick)="mouseAction('click',$event)"
                (nzOnDragStart)="mouseAction('dragstart',$event)"
                (nzOnDragEnter)="mouseAction('enter',$event)"
                (nzOnDragLeave)="mouseAction('leave', $event)"
                (nzOnDrop)="mouseAction('drop', $event)"
                (nzOnDragEnd)="mouseAction('end', $event)">
            </nz-tree>
          </div>
        </nz-card>
    </div>
    <div nz-col [nzMd]="16">
        <nz-card>
            <form nz-form [formGroup]="dictForm" (ngSubmit)="doEdit()" >
                <nz-form-item>
                    <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="code">编码</nz-form-label>
                    <nz-form-control [nzSm]="14" [nzXs]="24">
                      <input nz-input formControlName="code" id="code">
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item>
                    <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="title">名称</nz-form-label>
                    <nz-form-control [nzSm]="14" [nzXs]="24">
                      <input nz-input formControlName="name" id="titke">
                    </nz-form-control>
                </nz-form-item>

                <nz-form-item nz-row style="margin-bottom:8px;" *ngIf="editStatus">
                    <nz-form-control [nzSpan]="14" [nzOffset]="6">
                      <button *ngIf="formStatus=='update'" nz-button [nzLoading]='loading' nzType="primary" type="submit">更新</button>
                      <button *ngIf="formStatus=='create'" nz-button [nzLoading]='loading' nzType="primary" type="submit">保存</button>
                      <button nz-button (click)='cancel()'>取消</button>
                    </nz-form-control>
                </nz-form-item>
            </form>
        </nz-card>

        <nz-card nzTitle="字典值" [nzExtra]="addTemplate">
            <simple-table #st
                [columns]="columns"
                [data]="url"
                [ps]="ps"
                [extraParams]="q"
                [resReName]="{ total: 'data.total', list: 'data.rows' }"
                [reqReName]="{ pi:'pageNumber', ps: 'pageSize' }"
                toTopInChange
                [showTotal]="true"
                [showPagination]="true"
                [scroll]="{x: '600px'}"
                >
            </simple-table>
        </nz-card>
        <ng-template #addTemplate>
            <button *ngIf="addElementBtn" type="button" (click)="addElement()" nzSize="small" nz-button nzType="default" nzShape="circle"><i class="anticon anticon-plus"></i></button>
        </ng-template>
    </div>

</div>


